<template>
  <a-spin :spinning='loading' tip=" 正在加载数据，请耐心等待">
    <a-table
      ref="table"
      rowKey="id"
      size="middle"
      bordered
      :columns="columns"
      :dataSource="dataSource"
      :pagination="ipagination"
      @change="handleTableChange">
    </a-table>
  </a-spin>
</template>

<script>
import EpaSortService from '@/myService/EpaSortService'

export default {
  name: 'Step4',
  props: ['startDate','endDate'],
  data() {
    return {
      loading: true,
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30'],
        showTotal: (total, range) => {
          return range[0] + "-" + range[1] + " 共" + total + "条"
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0
      },
      timeValue: undefined,
      dataSource: [],
      queryParam: {
        startDate: '',
        endDate: ''
      },
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: (text, row, index) =>
            <span>{this.ipagination.pageSize * (this.ipagination.current - 1) + index + 1}</span>
        },
        {
          title: '信访件编号',
          align: "center",
          dataIndex: 'xfjbh'
        },
        {
          title: '登记时间',
          align: "center",
          dataIndex: 'djsj',
          customRender: function (text) {
            return !text ? "" : (text.length > 10 ? text.substr(0, 10) : text)
          }
        },
        {
          title: '去向单位',
          align: "center",
          dataIndex: 'dwmc'
        },
        {
          title: '信访人姓名',
          align: "center",
          dataIndex: 'contactName'
        },
        {
          title: '信访内容',
          align: "center",
          dataIndex: 'content',
          ellipsis: true
        },
        {
          title: '污染大类',
          align: "center",
          dataIndex: 'polluteName',
          ellipsis: true
        },
        {
          title: '污染小类',
          align: "center",
          dataIndex: 'categoryName',
          ellipsis: true
        },
        {
          title: '关键字',
          align: "center",
          dataIndex: 'keyName',
          ellipsis: true
        },
      ],
      downLoading: false
    }
  },
  methods:{
    getDataSourceList(){
      this.loading=true
      this.queryParam.startDate=this.startDate;
      this.queryParam.endDate=this.endDate;
      this.dataSource=[]
      this.ipagination.total=0
      this.queryParam.pageSize=this.ipagination.pageSize
      this.queryParam.currentPage=this.ipagination.current
      EpaSortService.selectXfjStep4(this.queryParam).then((res)=>{
        console.log(res)
        this.dataSource=res.result.records
        this.ipagination.total=res.result.total
      }).finally(
        ()=> {
          this.loading = false;
        }
      )
    },
    handleTableChange(pagination){
      console.log(pagination)
      this.ipagination.current=pagination.current
      this.ipagination.pageSize=pagination.pageSize
      console.log(this.ipagination)
      console.log("dddddddddd")
      this.getDataSourceList();
    },
  }
}
</script>

<style scoped>

</style>